implement ResourceList component with agencies pages (DEV-77) by ivymxu · Pull Request #14 · uwblueprint/home-again

ivymxu · 2026-02-24T01:00:14Z

Jira ticket link

DEV-77

Implementation description

Add reusable ResourceList component with loading/empty/error states
Refactor /agencies page and add detail/edit pages
Create apiClient utility for typed API requests

Steps to test

Navigate to http://localhost:3000/agencies
Verify the table renders with columns: Name, Email, Phone, City, Status
Test View action → /agencies/ shows agency details
Test Edit action → /agencies//edit shows form with save functionality
Test empty state by seeding no agencies
Verify loading skeleton appears while data loads

What should reviewers focus on?

ResourceList component is generic and reusable
Column/action configuration is extensible for other resources (clients, donors, etc)
Cell rendering: email/phone are linkified, status badges are color-coded
Tests cover critical paths: rendering, loading, empty, error, actions
API client properly handles request/response interceptors
Error handling in detail/edit pages and form mutations

Checklist

Format for branch, commit, and PR title: docs/GIT.md.

My branch name includes the Jira ticket key
My PR name is descriptive and in imperative tense
My PR name includes the Jira ticket key
My commit messages are descriptive and in imperative tense. My commits are atomic and trivial commits are squashed or fixup'd into non-trivial commits
My commit messages include the Jira ticket key
I have run the appropriate linter(s)
I have requested a review from the PL, as well as other devs who have background knowledge on this PR or who will be building on top of this PR

nuthanan06

just a couple changes on moving some things into other files + delete hasn't been implemented yet, otherwise lgtm! 🔥

frontend/app/agencies/page.tsx

frontend/app/agencies/[id]/edit/page.tsx

frontend/app/agencies/[id]/page.tsx

frontend/components/ResourceList.tsx

… (DEV-77)

kenzysoror

beautiful work, ivy!!😍

kenzysoror · 2026-03-14T10:27:22Z

frontend/components/ResourceList.tsx

+
+    case "text":
+    default:
+      return value != null ? String(value) : "—";


nit: this is the only branch that returns a plain string instead of JSX, potentially wrap (<>{value != null ? String(value) : "—"}</>) so it's consistent with the other cases

kenzysoror · 2026-03-14T10:28:10Z

frontend/app/agencies/[id]/page.tsx

+import Link from "next/link";
+import { useParams, useRouter } from "next/navigation";
+import { useAgency } from "@/hooks/useApi";
+import type { Agency } from "@/types";


looks like Agency isn't used and should be safe to remove

kenzysoror · 2026-03-14T10:36:06Z

frontend/components/ResourceList.tsx

+  return (
+    <div className="w-full" data-testid={testId}>
+      {/* Error State */}
+      {error && (


if a failed request is retried, error and loading might both be true at the same time - can we add && !loading to avoid rendering both states at the same time

kenzysoror · 2026-03-14T10:41:13Z

frontend/app/agencies/[id]/edit/page.tsx

+export default function AgencyEditPage() {
+  const params = useParams();
+  const router = useRouter();
+  const agencyId = params.id as string;


consider checking that params.id is a non-empty string before using it, and explicitly handle missing/invalid cases (e.g. render an error) instead of just casting

kenzysoror · 2026-03-14T10:41:54Z

frontend/app/agencies/[id]/page.tsx

+export default function AgencyDetailPage() {
+  const params = useParams();
+  const router = useRouter();
+  const agencyId = params.id as string;


same params.id comment as left in frontend/app/agencies/[id]/edit/page.tsx

kenzysoror · 2026-03-14T10:44:58Z

frontend/app/agencies/[id]/edit/page.tsx

+      <div className="min-h-screen flex flex-col">
+        <header className="w-full bg-gradient-to-r from-blue-600 to-blue-800 text-white shadow-lg">
+          <div className="max-w-6xl mx-auto px-6 py-6 flex justify-between items-center">
+            <h1 className="text-2xl font-bold">Loading…</h1>
+            <button
+              onClick={() => router.back()}
+              className="px-4 py-2 bg-white/20 rounded hover:bg-white/30 transition"
+            >


we seem to be duplicating the full page layout multiple times in this file - let's extract a shared layout component

kenzysoror · 2026-03-14T10:50:11Z

frontend/app/agencies/[id]/page.tsx

+
+  if (isLoading) {
+    return (
+      <div className="min-h-screen flex flex-col">


same layout duplication as in frontend/app/agencies/[id]/edit/page.tsx

kenzysoror · 2026-03-14T10:52:00Z

frontend/app/agencies/__tests__/page.test.tsx

+  beforeEach(() => {
+    (useAgencies as jest.Mock).mockReset();
+    (useDeleteAgency as jest.Mock).mockReturnValue({ mutate: jest.fn() });
+    jest.spyOn(global, "confirm").mockReturnValue(true);


it doesn't look like we ever restore the confirm spy - let's add something like afterEach(() => jest.restoreAllMocks()) to prevent the mock from leaking into other tests

kenzysoror · 2026-03-14T10:59:52Z

frontend/hooks/useApi.ts

+    },
+    staleTime: 1000 * 60 * 5,


Suggested change

},

staleTime: 1000 * 60 * 5,

},

enabled: Boolean(agencyId),

staleTime: 1000 * 60 * 5,

this should tell the query to wait until there's a real value before making any network calls

ivymxu added 3 commits February 26, 2026 20:00

feat: add ResourceList component and types (DEV-77)

55c8501

feat: refactor agencies with detail/edit pages (DEV-77)

f2350a0

test: add ResourceList tests and Jest config (DEV-77)

c27853f

ivymxu force-pushed the feature/DEV-77/resourcelist branch from ea7e9ce to c27853f Compare February 27, 2026 01:00

ivymxu requested review from kenzysoror and sonya-q February 27, 2026 01:04

ivymxu force-pushed the feature/DEV-77/resourcelist branch from cbf380b to a117e60 Compare February 27, 2026 01:08

ivymxu marked this pull request as ready for review February 27, 2026 01:09

nuthanan06 assigned nuthanan06 and ivymxu and unassigned nuthanan06 Mar 6, 2026

kenzysoror requested review from nuthanan06 and removed request for sonya-q March 6, 2026 13:22

nuthanan06 requested changes Mar 8, 2026

View reviewed changes

Copilot AI review requested due to automatic review settings March 10, 2026 00:17

ivymxu force-pushed the feature/DEV-77/resourcelist branch from a117e60 to 6e79ad6 Compare March 10, 2026 00:17

Copilot started reviewing on behalf of ivymxu March 10, 2026 00:18 View session

This comment was marked as resolved.

Sign in to view

ivymxu force-pushed the feature/DEV-77/resourcelist branch from 6e79ad6 to 784e365 Compare March 10, 2026 00:23

uwblueprint deleted a comment from Copilot AI Mar 10, 2026

ivymxu force-pushed the feature/DEV-77/resourcelist branch from 784e365 to d49f48b Compare March 10, 2026 00:46

uwblueprint deleted a comment from Copilot AI Mar 10, 2026

fix: upgrade @testing-library/react to v16 for React 19 compatibility…

1a294e2

… (DEV-77)

ivymxu force-pushed the feature/DEV-77/resourcelist branch from 435bec2 to 1a294e2 Compare March 10, 2026 00:51

uwblueprint deleted a comment from Copilot AI Mar 10, 2026

kenzysoror requested changes Mar 14, 2026

View reviewed changes

kenzysoror mentioned this pull request Mar 15, 2026

added ResourceDetail + ConfirmModal (DEV-78) #22

Open

7 tasks

Conversation

ivymxu commented Feb 24, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Jira ticket link

Implementation description

Steps to test

What should reviewers focus on?

Checklist

Uh oh!

nuthanan06 left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

This comment was marked as resolved.

Uh oh!

kenzysoror left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

kenzysoror Mar 14, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

kenzysoror Mar 14, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

ivymxu commented Feb 24, 2026 •

edited

Loading

kenzysoror Mar 14, 2026 •

edited

Loading

kenzysoror Mar 14, 2026 •

edited

Loading